{include file="public/header"/}
<link rel="stylesheet" href="/public/static/admin/easyui/layui-v2.6.8/css/layui.css">
<style>
	
	html,body{background-color: #fff;}
	.editPopupBox{
		width: 100%;
		height: auto;
		padding: 20px 30px;
		box-sizing: border-box;
	}
	body{background: #fff;}
	.mod-form-rows .label-wrap{font-size:12px;}
	.mod-form-rows .row-item {padding-bottom: 15px;margin-bottom: 0;}/*兼容IE7 ，重写common的演示*/
	.manage-wrapper{margin:26px auto 0px auto;width:600px;}
	.manage-wrap .ui-input{width: 198px;}
	.base-form{*zoom: 1;}
	.base-form:after{content: '.';display: block;clear: both;height: 0;overflow: hidden;}
	.base-form li{float: left;width: 290px;}
	.base-form li.odd{padding-right:20px;}
	.manage-wrap textarea.ui-input{width: 588px;height: 60px;overflow:hidden;}
	#receiveFunds,#periodReceiveFunds{text-align: right;}

	.contacters{margin-bottom: 10px;}
	.contacters h3{margin-bottom: 10px;font-weight: normal;}
	.mod-form-rows .pb0{padding-bottom:0;}
	.mod-form-rows .ctn-wrap{overflow: visible;}
	.ui-combo-wrap {position: static;}

	.chk{margin: 0 10px}
	.chk input {
	display: none;
	}
	#demo{padding: 6px 15px; width: 486px}
	.layui-form-checked[lay-skin=primary] i{
		border-color: #5dc5e7!important;
    	background-color: #5dc5e7;
	}
	.layui-form-checkbox[lay-skin=primary]:hover i{
		border-color: #5dc5e7;
	}
	.layui-form-select dl dd.layui-this {
		background-color: #d6d6d6;
		color: #000;
	}
	.layui-input, .layui-select, .layui-textarea{height: 34px;}
	.layui-form-select dl{
		max-height: 224px;
		left: -1px;
    	top: 34px;
	}
</style>
	<div id="manage-wrap" class="manage-wrap editPopupBox">
	<form id="manage-form" class="layui-form" novalidate="novalidate">
		<ul class="mod-form-rows base-form" id="base-form">
			<li class="row-item odd">
				<div class="label-wrap"><label for="billstype">单据类型</label></div>
				<div class="ctn-wrap">
					<!-- <span id="billstype"></span> -->
					<div class="layui-input-block" style="margin-left: 81px;min-height: 34px;">
						<select name="type" lay-filter="aihao">
							{volist name="type" id="vo"}
								<option value="{$vo.id}">{$vo.name}</option>
							{/volist}
						</select>
					</div>
				</div>
			</li>
			<li class="row-item">
				<div class="label-wrap"><span class="red">*</span><label for="name">规则名称</label></div>
				<div class="ctn-wrap"><input type="text" value="" id="name" class="ui-input" name="name"></div>
			  </li>
			  
			  <li class="row-item odd">
				<div class="label-wrap"><span class="red">*</span><label for="prefix">编码前缀</label></div>
				<div class="ctn-wrap"><input type="text" value="" name="code_prev" class="ui-input" id="prefix" /></div>
			  </li>
			  <li class="row-item">
				<div class="label-wrap"></div>
				<div class="ctn-wrap " style="height: 30px;padding: 2px 5px;">
					<input type="checkbox" name="Y" lay-skin="primary" id="yearInput" title="年" value="1" lay-filter="yearInput" >
					<input type="checkbox" name="M" lay-skin="primary" id="monthInput" title="月" value="1" lay-filter="monthInput" >
					<input type="checkbox" name="D" lay-skin="primary" id="dayInput" title="日" value="1" lay-filter="dayInput" >
				</div>
			  </li>
	
			  <li class="row-item odd">
				<div class="label-wrap"><span class="red">*</span><label for="">编码位数</label></div>
				<div class="ctn-wrap"><input type="text" placeholder="仅能输入正整数" class="ui-input ui-input-ph" name="code_length" id="digits" style="width: 196px;color:#000;" /></div>
			  </li>
			  <li class="row-item">
				<div class="label-wrap"><span class="red">*</span><label for="date">起始编号</label></div>
				<div class="ctn-wrap"><input type="text" placeholder="不允许输入0或特殊字符" class="ui-input ui-input-ph" value="" name="code_start" id="startNo" style="width: 196px;color:#000;" /></div>
			  </li>
			  <div style="clear:both"></div>
			  <li class="row-item" style="width: 100%">
				<div class="label-wrap"><label for="receiveFunds">范例</label></div>
				<div class="ctn-wrap"><input type="text" value="" id="demo" disabled="1"></div>
			  </li>
			  <li id="defaults" class="checkboxli" style="float: right; text-align: right">
				<input type="checkbox" value="1" name="is_default" lay-skin="primary" id="defaultsInput" title="是否默认">
			  </li>

		</ul>
		<input type="hidden" name="code_rule" id="code_rule">
	</form>
	
</div>
<script src="/public/static/admin/easyui/layui-v2.6.8/layui.js"></script>
<script>
	function getCodeRule() {
		var html = "";
		var prefix = $("#prefix").val();
		html += prefix;
		// 判断年月日是否勾选
		var date = new Date();
		if($('#yearInput').prop('checked')){
			html += date.getFullYear();
		}
		if($('#monthInput').prop('checked')){
			var month = date.getMonth();
			month += 1;
			if(month < 10){
				month = '0' + month;
			}
			html += month;
		}

		if($('#dayInput').prop('checked')){
			var date = date .getDate();
			if(date < 10){
				date = '0' + date;
			}
			html += date;
		}
		var endHtml = "";
		// 编码位数
		var code_length = $("#digits").val();
		// 起始编号
		var code_start = $("#startNo").val();
		code_length = parseInt(code_length);
		code_start_length = code_start.length;
		if(code_start_length > code_length){
			$("#startNo").val("");
			layer.msg("起始编号不能超过最大编码位数");
		}
		var zero = code_length - code_start_length;
		for (var i = 0; i < zero; i++) {
			endHtml += "0";
		};
		endHtml += code_start;
		html += endHtml;
		// 赋值
		$("#demo").val(html);
		$("#code_rule").val(html);

	}

	$(document).keyup(function(event){
		var prefix = $("#prefix").val();
		// 编码位数
		var code_length = $("#digits").val();
		// 起始编号
		var code_start = $("#startNo").val();
		if(prefix != "" && code_length != "" && code_start != ""){
			getCodeRule();
		}
		
	});

	layui.use(['form', 'layer', 'upload'], function () {
        $ = layui.jquery;
        var form = layui.form
        form.on('checkbox(yearInput)', function(data){
        	var prefix = $("#prefix").val();
			// 编码位数
			var code_length = $("#digits").val();
			// 起始编号
			var code_start = $("#startNo").val();
			if(prefix != "" && code_length != "" && code_start != ""){
				getCodeRule();
			}
        });

        form.on('checkbox(monthInput)', function(data){
        	var prefix = $("#prefix").val();
			// 编码位数
			var code_length = $("#digits").val();
			// 起始编号
			var code_start = $("#startNo").val();
			if(prefix != "" && code_length != "" && code_start != ""){
				getCodeRule();
			}
        });

        form.on('checkbox(dayInput)', function(data){
        	var prefix = $("#prefix").val();
			// 编码位数
			var code_length = $("#digits").val();
			// 起始编号
			var code_start = $("#startNo").val();
			if(prefix != "" && code_length != "" && code_start != ""){
				getCodeRule();
			}
        });

    });

	
</script>
{include file="public/footer"/}
		
